import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const WaterWellDataMeta: IPublicTypeComponentMetadata = {
  componentName: 'WaterWellData',
  title: '集水井数据',
  category: '信息展示',
  group: '气象防灾',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: 'hzdz-charts',
    version: '0.1.0',
    exportName: 'WaterWellData',
    main: 'src/index.tsx',
    destructuring: true,
    subName: ''
  },
  props: [
    {
      name: 'ref',
      propType: 'object',
    },
    {
      name: 'key',
      propType: 'string',
    },
    {
      name: 'style',
      propType: 'object',
    },
    {
      name: 'className',
      propType: 'string',
    },
    {
      name: 'width',
      propType: 'number',
      description: '组件宽度'
    },
    {
      name: 'height',
      propType: 'number',
      description: '组件高度'
    },
    {
      name: 'iconPath',
      propType: 'string',
      description: '图标路径'
    },
    {
      name: 'dataValue',
      propType: 'string',
      description: '数据值'
    },
    {
      name: 'dataUnit',
      propType: 'string',
      description: '数据单位'
    },
    {
      name: 'statusLabel',
      propType: 'string',
      description: '状态标签'
    },
    {
      name: 'dataValueColor',
      propType: 'string',
      description: '数据值颜色'
    },
    {
      name: 'dataUnitColor',
      propType: 'string',
      description: '数据单位颜色'
    },
    {
      name: 'statusLabelColor',
      propType: 'string',
      description: '状态标签颜色'
    },
    {
      name: 'showGradientText',
      propType: 'bool',
      description: '显示渐变文字'
    },
    {
      name: 'showGradientBackground',
      propType: 'bool',
      description: '显示渐变背景'
    },
    {
      name: 'gradientBackgroundOpacity',
      propType: 'number',
      description: '渐变背景透明度'
    },
    {
      name: 'theme',
      propType: 'string',
      description: '主题'
    },
    {
      name: 'onIconClick',
      propType: 'func',
      description: '图标点击事件'
    },
    {
      name: 'onDataClick',
      propType: 'func',
      description: '数据点击事件'
    },
    {
      name: 'onStatusClick',
      propType: 'func',
      description: '状态点击事件'
    },
    {
      name: 'onClick',
      propType: 'func',
      description: '点击事件'
    }
  ],
  configure: {
    props: [
      {
        name: 'dataValue',
        title: { label: { type: 'i18n', 'en-US': 'dataValue', 'zh-CN': '数据值' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: '24' }
      },
      {
        name: 'dataUnit',
        title: { label: { type: 'i18n', 'en-US': 'dataUnit', 'zh-CN': '数据单位' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: '个' }
      },
      {
        name: 'statusLabel',
        title: { label: { type: 'i18n', 'en-US': 'statusLabel', 'zh-CN': '状态标签' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: '正常' }
      },
      {
        name: 'iconPath',
        title: { label: { type: 'i18n', 'en-US': 'iconPath', 'zh-CN': '图标路径' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: 'http://localhost:8085/static/images/qixiangfangzhai/bz105.png' }
      },
      {
        name: 'dataValueColor',
        title: { label: { type: 'i18n', 'en-US': 'dataValueColor', 'zh-CN': '数据值颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: '#1AD7FF' }
      },
      {
        name: 'dataUnitColor',
        title: { label: { type: 'i18n', 'en-US': 'dataUnitColor', 'zh-CN': '数据单位颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: '#FFFFFF' }
      },
      {
        name: 'statusLabelColor',
        title: { label: { type: 'i18n', 'en-US': 'statusLabelColor', 'zh-CN': '状态标签颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: '#FFFFFF' }
      },
      {
        name: 'showGradientText',
        title: { label: { type: 'i18n', 'en-US': 'showGradientText', 'zh-CN': '显示渐变文字' } },
        setter: { componentName: 'BoolSetter', isRequired: false, initialValue: true }
      },
      {
        name: 'showGradientBackground',
        title: { label: { type: 'i18n', 'en-US': 'showGradientBackground', 'zh-CN': '显示渐变背景' } },
        setter: { componentName: 'BoolSetter', isRequired: false, initialValue: true }
      }
    ],
    supports: {
      style: true
    }
  }
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: '集水井数据',
    screenshot: '',
    schema: {
      componentName: 'WaterWellData',
      props: {
        width: 184,
        height: 48,
        iconPath: 'http://localhost:8085/static/images/qixiangfangzhai/bz105.png',
        iconSize: { width: 32, height: 36 },
        dataValue: '24',
        dataUnit: '个',
        statusLabel: '正常',
        dataValueColor: '#1AD7FF',
        dataUnitColor: '#FFFFFF',
        statusLabelColor: '#FFFFFF',
        showGradientText: true,
        gradientColors: ['#FFFFFF', '#81C6FF'],
        showGradientBackground: true,
        gradientBackgroundColors: [
          'rgba(52,165,255,0)',
          'rgba(52,165,255,0.39)',
          'rgba(52,165,255,0.45)',
          'rgba(52,165,255,0.35)',
          'rgba(0,139,255,0)'
        ],
        gradientBackgroundOpacity: 0.65,
        fontSize: {
          dataValue: 20,
          dataUnit: 14,
          statusLabel: 14
        },
        fontWeight: {
          dataValue: 'bold',
          dataUnit: 500,
          statusLabel: 500
        },
        theme: 'dark'
      }
    }
  }
];

export default {
  ...WaterWellDataMeta,
  snippets
}; 